<template>
	<view>
		<index ref="mesgIndex" @mesgTotalCount="mesgHz" v-if="PageCur==='mesg'"></index>

		<workbench v-if="PageCur==='workbench'"></workbench>

		<books v-if="PageCur==='book'"></books>

		<me v-if="PageCur==='me'"></me>

		<view class="box">
			<view class="cu-bar tabbar bg-white shadow foot">
				<view class="action" @click="NavChange" data-cur="mesg">
					<view class='cuIcon-cu-image'>
						<view class="cu-tag badge"></view>
						<image v-if="PageCur=='mesg'" src="../../static/tabBar/index_cur.png"></image>
						<image v-if="PageCur != 'mesg'" src="../../static/tabBar/index.png"></image>
					</view>
					<view :class="PageCur=='mesg'?'color_main':'text-gray'">消息</view>
				</view>

				<view class="action" @click="NavChange" data-cur="workbench">
					<view class='cuIcon-cu-image'>
						<view class="cu-tag badge"><!-- 红点 --></view>
						<image v-if="PageCur=='workbench'" src="../../static/tabBar/apply_cur.png"></image>
						<image v-if="PageCur != 'workbench'" src="../../static/tabBar/apply.png"></image>
					</view>
					<view :class="PageCur=='workbench'?'color_main':'text-gray'">工作台</view>
				</view>


				<view class="action" @click="NavChange" data-cur="book">
					<view class='cuIcon-cu-image'>
						<image v-if="PageCur=='book'" src="../../static/tabBar/book_cur.png"></image>
						<image v-if="PageCur != 'book'" src="../../static/tabBar/book.png"></image>
					</view>
					<view :class="PageCur=='book'?'color_main':'text-gray'">通讯录</view>
				</view>

				<view class="action" @click="NavChange" data-cur="me">
					<view class='cuIcon-cu-image'>
						<image v-if="PageCur=='me'" src="../../static/tabBar/me_cur.png"></image>
						<image v-if="PageCur != 'me'" src="../../static/tabBar/me.png"></image>
					</view>
					<view :class="PageCur=='me'?'color_main':'text-gray'">我的</view>
				</view>

			</view>
		</view>

	</view>
</template>

<script>
	import request from '@/common/request.js';
	import index from "../msg/index.vue"; //首页
	import workbench from "../workbench/index.vue"; //工作台
	import books from "../book/index.vue"; //通讯录
	import me from "./me.vue"; //个人中心
	export default {
		components: {
			index,
			workbench,
			books,
			me
		},
		data() {
			return {
				PageCur: 'mesg',
				message: 0,
				openId: '',
				access_token: '',
				tip: "我是提示",
				duration: 1

			};
		},
		// 分享小程序
		onShareAppMessage(res) {
			return {
				title: '学技术·找案例，快来「前端铺子」吧！',
				imageUrl: 'https://cdn.zhoukaiwen.com/qdpz_share.jpg',
			};
		},
		onLoad(option) {
			// wx.showShareMenu({
			// 	withShareTicket: true
			// })
			if (option.type == 'matting') {
				uni.navigateTo({
					url: '../main/matting'
				})
				return
			}
		},

		onShow() {
			//this.getData();
		},
		methods: {
			// 设置总消息提示数字
			mesgHz(value) {
				this.message = value
			},
			touchPage() {
				this.PageCur = 'mesg';
				this.$refs.mesgIndex.backInit()
			},
			getData() {
				let opts = {
					url: 'api/blog/list',
					method: 'get'
				};
				uni.showLoading({
					title: '加载中'
				});
				request.httpRequest(opts).then(res => {
					// console.log(res);
					uni.hideLoading();
					// if (res.statusCode == 200) {
					// 	this.message = res.data.data.length;
					// } else {
					// 	console.log('数据请求错误～');
					// }
				});
			},
			ShowNews(e) {
				this.PageCur = e;
			},
			NavChange: function(e) {
				this.PageCur = ''
				this.PageCur = e.currentTarget.dataset.cur;
				console.log("dgfdgd", this.PageCur)

			},
			NavChange_xd: function() {
				uni.navigateTo({
					url: 'publish',
					animationType: 'slide-in-bottom',
					animationDuration: 200
				});
			}
		}
	}
</script>

<style lang="scss">
	.color_main {
		color: #000000;
		font-weight: 900;
	}

	.box {
		margin: 20upx 0;
	}

	.box view.cu-bar {
		margin-top: 20upx;
	}

	.logo_btn {
		width: 38*2rpx;
		height: 38*2rpx;
		position: absolute;
		z-index: 2;
		border-radius: 50%;
		top: -40rpx;
		left: 0rpx;
		right: 0;
		margin: auto;
		padding: 0;
	}

	.cu-bar.tabbar .action.add-action {
		padding-top: 56rpx !important;
	}

	.bg-white {
		box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3) !important;
		transition: transform 0.4s ease-in-out !important;
	}

	.bg-white:hover {
		transform: scale(1.05);
	}
</style>